<!--
 * @Descripttion: --
 * @Author: zhoujj
 * @Date: 2021-07-02 08:56:43
 * @LastEditors: zhoujj
 * @LastEditTime: 2022-05-25 14:20:39
-->
<template>
  <div>
    <component
      v-for="(item, index) in list"
      :key="item.id"
      :is="item.type"
      :item="item"
      :number="index"
      :uploadUrl="uploadUrl"
      :uploadHeader="uploadHeader"
      @changeComponent="getBackVal"
    >
      <template v-slot:selectContent>{{ selectSlot }}</template>
    </component>
  </div>
</template>

<script>
    import * as FormItem from '../el-form.js'
    export default {
        props: {
            requestData: {
                type: Array,
                default: () => {
                    return []
                }
            },
            uploadUrl: {
                type: String,
                default: () => {
                    return ''
                }
            },
            selectSlot: {
                type: String,
                default: () => {
                    return ''
                }
            },
            uploadHeader: {
                type: Object,
                default: () => {
                    return ''
                }
            }
        },
        components: FormItem,
        data () {
            return {
                list: []
            }
        },
        methods: {
            // 获取控件输入返回值
            getBackVal (obj) {
                this.list[obj.number].value = obj.value
                this.$emit('getVal', {
                    list: this.list
                })
            },
            // 表单提交
            submit (cb) {
                let results = this.list.map((val, index) => {
                    return new Promise((resolve, reject) => {
                        this.$children[index].$refs.form.validate((valid) => {
                            if (valid) {
                                resolve()
                            } else {
                                reject()
                            }
                        })
                    })
                })
                return Promise.all(results)
                    .then((res) => {
                        cb(true)
                    })
                    .catch((err) => {
                        cb(false)
                    })
            }
        },
        mounted () {
            this.list = this.requestData
        }
    }
</script>

<style></style>
